import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

//1.引入
import { getBanner } from "../request/api.js"

export default new Vuex.Store({
  // 唯一的数据源，公共的数据就定义在这
  state: {
    bannerList: []
  },
  //充当视图层和状态层的中间层，具有缓存作用，用于获取state中的数据，处理好数据后返回(计算属性)
  getters: {

  },

  //修改数据的唯一方式，同步，需要通过commit触发才能修改
  mutations: {
    mutation_bannerList(state,payload){
      state.bannerList = payload;
    }
  },

  //可以做同步和异步操作，必须要用dispatch派遣才能调用
  actions: {
    //去做异步操作，
    action_bannerList({ commit }) {
      //发请求
      getBanner()
        .then(res => {
          if(res.data.code == 200){
            //交给mutations去修改数据
            commit("mutation_bannerList",res.data.list)
          }
        })
        .catch(err => {
          console.log(err);
        })
    }
  },
  modules: {
  }
})
